<!doctype html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<link rel="stylesheet" href="__WK__/css/style.css">
	<script type="text/javascript" src="__WK__/js/jquery-3.1.0.min.js"></script>
</head>
<body>
	<div class="header">
		<div class="wrap">
			<ul>
				<a href=""><li>首页</li></a>
				<a href=""><li>口语预约</li></a>
				<a href=""><li>写作预约</li></a>
				<a href=""><li class="selected"></a>个人中心</li>
			</ul>
			<span class="wel">Welecome 14526-Mark</span>
		</div>
	</div>
	<div class="nav">
		<div class="logo">
			<img src="__WK__/image/logo.png" alt="">
		</div>
		<div class="list">
			<div class="item">
				<img src="__WK__/image/spoken.png" alt="">
				<a href="">口语记录</a>
			</div>
			<div class="item">
				<img src="__WK__/image/write.png" alt="">
				<a href="">作文记录</a>
			</div>
			<div class="item">
				<img src="__WK__/image/user_pre.png" alt="">
				<a href="">个人信息</a>
			</div>

		</div>
	</div>
	<div class="content">
		<!-- <div class="title_wrap">
			<span class="title">个人信息</span>
			<span class="edit">编辑</span>
			<img src="image/edit.png" alt="">
		</div>
		<div class="inp">
			<span class="title1">昵称</span>
			<input type="text" class="inp_in" placeholder="请输入新昵称">
		</div>
		<div class="inp">
			<span class="title1">QQ</span>
			<input type="text" class="inp_in" placeholder="请输入QQ号">
		</div>
		<div class="inp">
			<span class="title1">Zoom</span>
			<input type="text" class="inp_in" placeholder="请输入Zoom号">
		</div> -->
		<div class="title_wrap">
			<span class="title">个人信息</span>
			<a href=""><span class="edit">编辑</span></a>
			<img src="__WK__/image/edit.png" alt="">
		</div>
		<div class="inp">
			<span class="title1">昵称</span>
		<!-- 	<input type="text" class="inp_in" placeholder="请输入新昵称"> -->
		<span class="inp_text">14526-MACK</span>
		</div>
		<div class="inp">
			<span class="title1">QQ</span>
			<!-- <input type="text" class="inp_in" placeholder="请输入QQ号"> -->
			<span class="inp_text">760571888</span>
		</div>
		<div class="inp">
			<span class="title1">Zoom</span>
			<!-- <input type="text" class="inp_in" placeholder="请输入Zoom号"> -->
			<span class="inp_text">760571888</span>
		</div>
		<div class="title_wrap">
			<span class="title">我的余额</span>
			<span class="fu">口语 : 20课时</span>
			<span class="fu1">作文 : 20课时</span>
		</div>
		<div class="title_wrap">
			<span class="title">考试设置</span>
				<span class="edit">编辑</span>
			<img src="__WK__/image/edit.png" alt="">
		</div>
		<div class="inp">
			<span class="title1">选择课程</span>
			<input type="button" class="btn btn_s"value="雅思" >
			<input type="button" class="btn" value="托福" >
		</div>
		<div class="inp">
			<span class="title1">考试时间</span>
			<input type="text" class="inp_in" placeholder="请输入考试时间 年-月-日">
		</div>
		<div class="inp">
			<span class="title1">目标分数</span>
			<input type="text" class="inp_in" placeholder="请输入目标分数">
		</div>
		<div class="inp">
			<span class="title1">目标国家</span>
			<!-- <input type="text" class="inp_in" placeholder="请输入Zoom号"> -->
			<select class="inp_select">
			  <option value ="">请选择目标国家</option>
			  <option value ="volvo">Volvo</option>
			  <option value ="saab">Saab</option>
			  <option value="opel">Opel</option>
			  <option value="audi">Audi</option>
			</select>
		</div>
		<div class="inp">
			<span class="title2">申请资料<br>是否提交</span>
			<!-- <input type="text" class="inp_in" placeholder="请输入Zoom号"> -->
			<select class="inp_select">
			  <option value ="">请选择</option>
			  <option value ="1">是</option>
			  <option value ="0">否</option>
			</select>
		</div>
		<div class="inp">
			<button class="submit">提交</button>
		</div>	
	</div>
	<div class="help">
		<span><img src="__WK__/image/zhu.png" alt=""></span>
		<p>助教</p>
	</div>
</body>
<script type="text/javascript">
	$(".btn").on("click",function(){
		$(".btn").removeClass('btn_s');
		$(this).addClass('btn_s');
	})
</script>
</html>